<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/html" style="">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>登录页面</title>
    <!-- Tell the browser to be responsive to screen width -->
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <!-- Font Awesome -->
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css">
    <!-- Ionicons -->
    <link rel="stylesheet" href="https://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css">
    <!-- Theme style -->
    <link rel="stylesheet" href="../../../dist/css/adminlte.min.css">
    <link rel="stylesheet" href="../extra.css">

    <!-- iCheck -->
    <link rel="stylesheet" href="../../../plugins/iCheck/square/blue.css">
    <!-- Google Font: Source Sans Pro -->
    <link href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400,400i,700" rel="stylesheet">

</head>
<body class="hold-transition login-page">
<div class="login-box">
    <!--<div class="login-logo">
        <b>“案件侦查系统”</b>
    </div>-->
    <!-- /.login-logo -->
    <div class="card">
        <div class="card-body login-card-body">
            <p class="login-box-msg" style="font-weight:bold;">欢迎使用案件侦查平台</p>

            <form id="login-form" method="post">
                <div class="form-group has-feedback">
                    <span class="fa fa-cloud form-control-feedback"> 账号</span>
                    <input type="text" id="userId" class="form-control" placeholder="请输入账号"
                           onfocus="this.setAttribute('placeholder', '');
           focus();" onblur="if (this.value == ''){this.setAttribute('placeholder', '请输入账号');
}
           blur()">
                </div>
                <div class="form-group has-feedback">
                    <span class="fa fa-lock form-control-feedback"> 密码</span>
                    <input type="password" id="password" class="form-control" placeholder="请输入密码"
                           onfocus="this.setAttribute('placeholder', '');
           focus();" onblur="if (this.value == ''){this.setAttribute('placeholder', '请输入密码');
}
           blur()">
                </div>

                <div class="row">
<!--                    <div class="col-8">-->
<!--                        <div class="checkbox icheck">-->
<!--                            <label>-->
<!--                                <input type="checkbox" name="rememberpass" id="rememberpass"> 记住密码-->
<!--                            </label>-->
<!--                        </div>-->
<!--                    </div>-->
                    <!-- /.col -->
                   <div class="col-4" style="flex: 0 0 100%;max-width: 100%;">
                        <button type="button" class="btn btn-primary btn-block btn-flat" onclick="login()" style="border-radius: .25rem;" >立即登录</button>
                   </div>
                    <!-- /.col -->
                </div>
            </form>

<!--            <div class="social-auth-links text-center mb-3">-->
<!--                <p>- 或 -</p>-->
<!--                &lt;!&ndash;<a href="#" class="btn btn-block btn-primary">&ndash;&gt;-->
<!--                &lt;!&ndash;<i class="fa fa-facebook mr-2"></i> Sign in using Facebook&ndash;&gt;-->
<!--                &lt;!&ndash;</a>&ndash;&gt;-->
<!--                <a href="loginwithEmail.html" class="btn btn-block btn-danger">-->
<!--                    邮箱登录-->
<!--                </a>-->
<!--            </div>-->
            <!-- /.social-auth-links -->

            <p class="mb-0" style="font-size: 1%;margin-top: 2%">
                <a >忘记密码请联系管理员 <a a href="#">刘子豪 </a></a>
            </p>
<!--            <p class="mb-0">-->
<!--                <a href="register.html" class="text-center">注册账号</a>-->
<!--            </p>-->
        </div>
        <!-- /.login-card-body -->
    </div>
</div>
<!-- /.login-box -->

<!-- jQuery -->
<script src="../../../plugins/jquery/jquery.min.js"></script>
<!-- Bootstrap 4 -->
<script src="../../../plugins/bootstrap/js/bootstrap.bundle.min.js"></script>
<!-- iCheck -->
<script src="../../../plugins/iCheck/icheck.min.js"></script>

<!--<script src="../../../config/config.js"></script>-->
<script>


  $(function () {
    $('input')
      .iCheck({
        checkboxClass: 'icheckbox_square-blue',
        radioClass: 'iradio_square-blue',
        increaseArea: '20%' // optional
      })

    checkIsRemember()
  })

  function checkIsRemember() {
    let rememberpass = sessionStorage.getItem('rememberpass')
    $('#rememberpass')
      .prop('checked', rememberpass)
    if (rememberpass == 'true') {
      $('#userId')
        .val(sessionStorage.getItem('username'))
      $('#password')
        .val(sessionStorage.getItem('password'))
    } else {
      sessionStorage.setItem('username', '')
      sessionStorage.setItem('password', '')
    }
  }

  function login() {
    let form = new FormData()
    let username = $('#userId')
      .val()
    let password = $('#password')
      .val()
    let rememberpass = $('#rememberpass')
      .is(':checked')

    form.append('id', username)
    form.append('password', password)
      form.append('type', 2)

    let settings = {
      'async': true,
      'crossDomain': true,
      'url': 'http://127.0.0.1:5744/api/auth/login',
      'method': 'POST',
      'headers': {},
      'processData': false,
      'contentType': false,
      'mimeType': 'multipart/form-data',
      'data': form
    }

    $.ajax(settings)
      .done(function (response) {
        console.log(response)
        response = JSON.parse(response)
        if (response.code == '0') {
          alert(response.message)

          sessionStorage.setItem('user_token', 'Bearer ' + response.data.token)
          sessionStorage.setItem('user_type', response.data.userType)
          sessionStorage.setItem('username', username)
          sessionStorage.setItem('password', password)
          sessionStorage.setItem('area_id', response.data.area_id)
          sessionStorage.setItem('rememberpass', rememberpass)


          var token = sessionStorage.getItem('user_token')
          console.log(token)
          var user_type = response.data.userType
          if (user_type == 2) {
            sessionStorage.setItem('user_id', response.data.userID)
            sessionStorage.setItem('user_uuid', response.data.userUUId)

            window.location.href = '../customer/index.html'
          } else if (user_type == 1) {
            sessionStorage.setItem('user_id', response.data.userID)
            sessionStorage.setItem('user_uuid', response.data.userUUId)
            window.location.href = '../merchant/index.html'

          } else if (user_type == 3) {
            window.location.href = '../admin/index.html'

          }

        } else {
          alert(response.message)
        }
      })
  }


</script>
</body>
</html>
